<!DOCTYPE html>
<html lang="en" ng-app="AldeasInfantiles">
<head>
  <title>Aldeas Infantiles | Administrar Ubicaciones</title>
  <?php
	  $this->load->view('head_view');
  ?>
  <script src="<?php echo base_url("assets/js/housing-view.js"); ?>"></script>
  <script src="<?php echo base_url("assets/js/menu-view.js"); ?>"></script>
</head>
<body>
  <div class="container">
    <div class="masthead">
      <?php
        $this->load->view('nav_view');
      ?>
    </div>
    <div class="jumbotron" ng-controller="Housing">
      <form class="form-horizontal" role="form" id="form-edit-housing">
        <h4>Editar Ubicaci&oacute;n <span class="glyphicon glyphicon-home"></span></h4>
        <div class="row">
          <div class="col-xs-4">
            <label for="add-housing-search" class="col-sm-12 control-label">Buscar:</label>
          </div>
          <div class="col-xs-4">
            <a href="#" data-toggle="modal" data-target="#modal-houses" ng-click="showHouses()"><span class="glyphicon glyphicon-search"></span> Buscar</a>
          </div>
        </div>
        <div class="row hide">
          <div class="col-xs-4">
            <label for="donorid" class="col-sm-12 control-label">Identificador:</label>
          </div>
          <div class="col-xs-4">
            <input type="text" class="form-control" ng-model="house.houseid" id="house.houseid" name="house.houseid" disabled>
          </div>
        </div>
        <div class="row">
          <div class="col-xs-4">
            <label for="selectedCountry" class="col-sm-12 control-label">Pa&iacute;s</label>
          </div>
          <div class="col-xs-4">
            <select id="selectedCountry" name="selectedCountry" class="form-control" title="Seleccione el pa&iacute;s de la ubicaci&oacute;n"
              ng-model="selectedCountry"
              ng-options="country.id_pais as country.ds_pais for country in countries"
              ng-change="requestDorpsByCountry()"
              >
            </select>
          </div>
        </div>
        <div class="row">
          <div class="col-xs-4">
            <label for="selectedDorp" class="col-sm-12 control-label">Programa:</label>
          </div>
          <div class="col-xs-4">
            <select id="selectedDorp" name="selectedDorp" class="form-control" title="Seleccione el programa de la ubicaci&oacute;n"
              ng-model="selectedDorp"
              ng-options="dorp.id_programa as dorp.ds_programa for dorp in dorps"
              >
            </select>
          </div>
        </div>
        <div class="row">
          <div class="col-xs-4">
            <label for="house.housenum" class="col-sm-12 control-label">Nombre/N&uacute;mero:</label>
          </div>
          <div class="col-xs-4">
            <input type="text" class="form-control" ng-model="house.housenum" id="house.housenum" name="house.housenum" maxlength="15" placeholder="Nombre/N&uacute;mero" title="Escriba el Nombre/N&uacute;mero de ubicaci&oacute;n" required>
          </div>
        </div>
        <div class="row">
          <div class="col-xs-4">
            <label for="house.detail" class="col-sm-12 control-label">Detalles:</label>
          </div>
          <div class="col-xs-4">
            <textarea rows="2" cols="30" maxlength="100" ng-model="house.detail" id="house.detail" name="house.detail" title="Escriba un detalle de la ubicaci&oacute;n">
            </textarea>
          </div>
        </div>
        <div class="row">
          <div class="col-xs-4">
          </div>
          <div class="col-xs-4">
            <input type="reset" class="btn btn-default" value="Cancelar"  />
            <input type="submit" class="btn btn-primary" value="Guardar" ng-click="getParams(house)" />
            <div id="messages-users" class="alert alert-dismissable {{alertClass}} {{hiddenClass}}">
              <strong>Mensaje!</strong> <span>{{errorMessage}}</span>
            </div>
          </div>
        </div>
      </form>

      <div class="modal fade" id="modal-houses" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">Seleccione una ubicaci&oacute;n</h4>
            </div>
                <div class="modal-body">
            <form class="form-horizontal" role="form" id="user-form">
              <div class="row">
                <div class="col-xs-2">
                  <h5>Filtrar:</h5>
                </div>
                <div class="col-xs-4">
                  <input type="text" class="form-control" placeholder="Nombre de la ubicaci&oacute;n" ng-model="query" id="userfilter" name="userfilter" value="" size="25" />
                </div>
              </div>
              <div class="list-group" role="navigation">
                <a ng-repeat="house in houses | filter:query" ng-click="getHouseById(house, $event)" href="" class="list-group-item">{{house.ds_casa}}</a>
              </div>
            </form>
                </div>
              </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div>
    </div>
    <?php
      $this->load->view('footer_view');
    ?>
  </div>
</body>
</html>